<template>
  <a-card title="组长标记统计">
    <a-tabs v-model="type" @change="onTabs">
      <a-tab-pane key="today" tab="本日"></a-tab-pane>
      <a-tab-pane key="month" tab="当月"></a-tab-pane>
    </a-tabs>
    <div class="table-page-search-wrapper">
      <a-form-model layout="inline">
        <a-row :gutter="20">
          <a-col :md="6" :sm="24">
            <a-form-model-item label="日期选择">
              <a-date-picker style="width:300px" v-model="time" @change="onChange"/>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </div>
    <s-table
      bordered
      :row-key="(record,index) => index"
      ref="table"
      :columns="lColumns"
      :data="lData"
    >
      <template slot='title'>
        <div :style="{ overflow: 'hidden' }">
          <div :style="{ float: 'left' }">
            标记总优秀数：<a-tag color="blue"> {{yx_sum_cum}}</a-tag>个，总异常数 <a-tag color='red'>{{wt_sum_cum}}</a-tag>个，已读 <a-tag color='purple'>{{yd_sum_cum}}</a-tag>个
          </div>
        </div>
      </template>
      <template slot="wt_num" slot-scope="text">
        <a-tag color='red'>{{text}}</a-tag>
      </template>
      <template slot="yx_num" slot-scope="text">
        <a-tag color="blue">{{text}}</a-tag>
      </template>
      <template slot='yd_num' slot-scope='text'>
        <a-tag color='purple'>{{text}}</a-tag>
      </template>
    </s-table>
  </a-card>
</template>

<script>
  import { STable } from '@/components'
  import col from '@/columns/wechat'
  import { getState1 } from '@/api/wechat'
  export default {
    components: {
      STable
    },
    name: 'WechatState',
    data () {
      return {
        lColumns: col.state1,
        lData: parameters => {
        return getState1(Object.assign(parameters, this.queryParam)).then(res => {
          this.yx_sum_cum = res.result.yx_sum_cum
          this.wt_sum_cum = res.result.wt_sum_cum
          this.yd_sum_cum = res.result.yd_sum_cum
          return res.result
        })
      },
        yx_sum_cum: '',
        wt_sum_cum: '',
        yd_sum_cum: '',
        queryParam: {},
        type: 'today',
        time: ''
      }
    },
    created () {
      this.queryParam['type'] = this.type
    },
    methods: {
      onChange (date, dateString) {
        const app = this
        app.time = dateString
        app.type = ''
        app.queryParam['type'] = app.time
        app.$refs.table.refresh(true)
      },
      onTabs (key) {
        const app = this
        app.time = ''
        app.queryParam['type'] = key
        app.$refs.table.refresh(true)
      }
    }
  }
</script>

<style scoped>

</style>
